<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"	
	template="/pages/plantilla.xhtml">
	
	<ui:define name="title">SISPAGOS | Consolidados</ui:define>
	<ui:define name="contenido" >
	<f:view>
		<h:form id="myform" prependId="false">
		<h:selectOneMenu value="#{estadisticaController.anioSeleccionado}" style="width:80px" disabled="false" >
			<f:selectItem itemLabel="2010" itemValue="2010"/>
			<f:selectItem itemLabel="2011" itemValue="2011"/>
			<f:selectItem itemLabel="2012" itemValue="2012"/>
			<f:selectItem itemLabel="2013" itemValue="2013"/>
			<f:ajax listener="#{estadisticaController.cargarChartAjax}" render="myform:panelGraf"/>
		</h:selectOneMenu>
        <h:selectOneMenu value="#{estadisticaController.mesSeleccionado}" style="width:120px" disabled="false">
			<f:selectItems value="#{loginController.listaMeses}"/>
			<f:ajax listener="#{estadisticaController.cargarChartAjax}" render="myform:panelGraf"/>
		</h:selectOneMenu>
		<h:panelGroup id="panelGraf">
		<p:barChart id="pchartCpto" value="#{estadisticaController.categoryModel}" legendPosition="ne"  
            title="Consolidados por Conceptos" style="height:300px"/>
		<h:dataTable value="#{estadisticaController.cptos}" var="cpto">
		<h:column>
		<f:facet name="header">Codigo</f:facet>
		<h:outputText value="#{cpto.codigoConceptoPago}"/>
		</h:column>
		<h:column>
		<f:facet name="header">Nombre</f:facet>
		<h:outputText value="#{cpto.nombreConceptoPago}"/>
		</h:column>
		</h:dataTable> 
		</h:panelGroup>

 		</h:form>
 		
 	</f:view>
	</ui:define>
</ui:composition>